<template>
  <a-modal width="45vw" :visible="visible" :mask-closable="false" title="导出" @ok="okFn" @cancel="close" @close="close" unmount-on-close>
    <div class="modal-body">
      <a-checkbox-group direction="vertical" v-model="checkedList">
        <a-checkbox value="1">导出费项结算及对账汇总信息（和对账列表信息一致）</a-checkbox>
        <a-checkbox value="2">导出对账明细（导出每一笔费用对应的多笔对账明细）</a-checkbox>
        <a-checkbox value="3">导出结算明细（导出每一笔费用对应的多笔结算明细）</a-checkbox>
      </a-checkbox-group>
    </div>
    <template #footer>
      <a-button @click="close">关闭</a-button>
      <a-button type="primary" @click="okFn">确认</a-button>
    </template>
    <!-- 订单费用导出 -->
    <orderCostModal :title="'订单费用导出'" ref="orderCostRef" :fetch="exportExcel" @ok="close" />
  </a-modal>
</template>

<script setup>
  import { ref } from 'vue'
  import { useExport } from '@/hooks/list'
  import { exportExcel } from '@/api/finance/examine'
  import orderCostModal from '../../../../order/modals/order-cost-modal/index.vue'
  const visible = ref(false)
  const checkedList = ref([])
  const queryParam = ref({})

  const orderCostRef = ref(null)
  const okFn = () => {
    queryParam.value.exportTypeList = checkedList.value
    if (checkedList.value.includes('3')) {
      orderCostRef.value.open(queryParam.value)
    } else {
      useExport(exportExcel, queryParam.value).then(() => {
        close()
      })
    }
  }

  const open = (params) => {
    queryParam.value = params
    visible.value = true
  }

  const close = () => {
    checkedList.value = []
    visible.value = false
  }

  defineExpose({
    open,
  })
</script>

<style lang="less" scoped>
  .modal-body {
    position: relative;
    width: 100%;
    max-height: 70vh;
  }
</style>
